<template>
  <div id="app">
    <button @click.prevent.stop="showPopup">popup</button>
    <popup v-model="show" 
    position="bottom"  
    :visible="show">
      <div class="content"></div>
    </popup>
  </div>
</template>

<script>
import Popup from "./components/popup.vue";
export default {
  name: "app",
  data() {
    return {
      show: false,
    };
  },
  components: {
    Popup,
  },
  watch:{
    show(val){
      console.log("show  ",val);
    }
  },
  methods: {
    showPopup() {
      this.show = true;
    },
  },
};
</script>

<style lang="scss">
.content{
  width: 100%;
  height: 200px;
  background: red;
}
</style>
